<script>
export default {
  name: 'apply',
  computed: {
    routeMeta() {
      return this.$route.meta;
    }
  },
  data() {
    return {
     //钱
      money: '',
      //备注
      remark: '',
    };
  }
};
</script>

<template>
  <frame-view class="index">
    <div
      style="background: linear-gradient( 122deg, #FFF6F6 0%, #FFFCFC 100%, #FFFCFC 100%);width: 750px;">
      <van-nav-bar
        :left-text="routeMeta.title"
        left-arrow
        @click-left="() => $router.go(-1)"
      />
      <div style="padding: 60px 40px 40px">
        <p style="display: flex;justify-content: space-between">
          <span>输入提现金额</span>
          <span style="color: #999999">可提现金额：1893.04元</span>
        </p>
        <div style="display: flex;justify-content: space-between">

          <van-field
            v-model="money"
            clearable
            placeholder="请输入提现金额"
            type="number"
            style="margin-top: 40px" />
          <van-button round type="info" plain style="width:160px;height: 60px;margin-top: 40px">提现</van-button>
        </div>
<!--        <p style="margin-top: 40px">备注信息</p>-->

<!--        <van-field-->
<!--          v-model="remark"-->
<!--          placeholder="请输入备注信息"-->
<!--          type="textarea"-->
<!--          style="margin-top: 10px" />-->

      </div>

    </div>

    <div style="display: flex;justify-content: space-between;margin-top: 37px">
      <p style="margin-left: 36px;font-size: 28px">个人信息</p>
      <p style="margin-right: 32px;font-size: 28px;display: flex;align-items: center">
        <img src="./image/icon-编辑@2x.png" style="width: 28px;height: 28px" alt="图片" />
        <span style="margin-left: 8px;color: #585858;">修改银行卡</span>
      </p>
    </div>
    <div style="background-color: #fff;padding: 0 36px;margin-top: 22px;font-size: 28px;border-radius: 20px">
      <p class="message">
        <span class="left">账户信息</span>
        <span>130*****9999</span>
      </p>
      <p class="message">
        <span class="left">真实姓名</span>
        <span>**群</span>
      </p>
      <p class="message">
        <span class="left">身份证号</span>
        <span>445************15</span>
      </p>
      <p class="message">
        <span class="left">银行卡号</span>
        <span>625************68</span>
      </p>
      <p class="message">
        <span class="left">银行</span>
        <span>建设银行</span>
      </p>
      <p class="message">
        <span class="left">开户行</span>
        <span>莆田分行</span>
      </p>

    </div>
    <p style="margin-left: 36px;font-size: 28px;margin-top: 37px">温馨提示</p>
    <div style="padding: 28px 58px 28px 36px;background-color: #fff;border-radius: 10px;margin-top: 23px;line-height: 38px;letter-spacing: 3px;">
      <p style="margin-top: 10px">1. 平台对于个人实名认证用户自动扣除6</p>
      <p style="margin-top: 10px">2. 每月25～28日为用户申请提现时间工作日内进行打款结算。</p>
    </div>
<div style="height: 20px"></div>
  </frame-view>
</template>

<style scoped lang="scss">
.index {
  color: #222222;
  font-size: 24px;
}

.message {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid #D5D5D5;
  align-items: center;
  height: 96px;

  .left{
    color: #999999;
  }
  &:last-child {
    border-bottom: none;
  }
}

:deep(.frame-view-content) {

  padding: 0 !important;
}

:deep(.van-cell) {
  background-color: rgba(255, 255, 255, 0);
  border-radius: 10px;
  border: 1px solid #D5D5D5;

  &:nth-child(1) {
    border-top: none;
    border-left: none;
    border-right: none;
  }
}

input {
  background-color: rgba(255, 255, 255, 0);
  border: 1px solid var(--primary-color);
}
</style>
